<template>
	<view>
		<view class="mt-65 plr-36 flex1 flex-middle">
			<view :class="[isActive==1?'active gray':'gray-2','nav text-center size-28']" @click="isActive=1">
				BUG
			</view>
			<view :class="[isActive==2?'active gray':'gray-2','nav text-center size-28 ml-20']" @click="isActive=2">
				建议
			</view>
			<view :class="[isActive==3?'active gray':'gray-2','nav text-center size-28 ml-20']" @click="isActive=3">
				投诉
			</view>
		</view>
		<view class="mt-40 mlr-36" style="background: #f8f8f8;">
			<u-field type="textarea" class="w100" v-model="message" :auto-height="false" :clearable="false" label-width="0" placeholder="请输入您的反馈情况"></u-field>
		</view>
		<view class="mt-40 mlr-36" style="background: #f8f8f8;">
			<u-field v-model="account" label-width="0" placeholder="请输入您的手机/QQ号/微信/邮箱（选填）"></u-field>
		</view>
		<view class="fixed-bottom pb-80">
			<u-button type="primary" :disabled="!message" @click="submit">提交</u-button>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				isActive: 1,//1=BUG,2=建议,3=投诉
				message:'',
				account:'',
				submitbtn:true
			}
		},
		methods: {
			submit(){
				if(this.submitbtn == true){
					this.submitbtn = false
					this.$http('/addons/ddrive/feedback/add',{
						type: this.isActive == 1 ? 'BUG' : this.isActive == 2 ? '建议' : '投诉',
						content: this.message,
						account: this.account
					},"POST").then(data=>{
						uni.showToast({
							title: '提交成功'
						})
						setTimeout(()=>{
							uni.navigateBack({})
						},1000)
					}).catch(data=>{
						this.submitbtn = true
					})
				}
			}
		}
	}
</script>

<style lang="scss" scoped>
	/deep/.u-btn{
		height: 96rpx !important;
	}
	/deep/.u-btn--primary--disabled {
		background-color: $bg-1 !important;
	}
	/deep/.u-primary-hover {
		background-color: $blue !important;
	}
	.nav {
		width: 146rpx;
		height: 70rpx;
		line-height: 70rpx;
		border: 1rpx solid #999;
	}

	.active {
		border: 1rpx solid $blue;
	}
</style>
